77 update textarea in featured games carousel #78
Conversation
There was a problem hiding this comment.
Nice! Great work! But a couple of requested changes:
- The top 5 games, does not link to the game detail page
- The reviews also does not support ratings, so this needs to be removed.
- The star and rating order is not the same throughout, maybe make this consistent.
- It also doesn't make sense to have Top rated games, when it is not the top rated games.
- Maybe just set ids of the herds picks, and fetch them from the backend, and add the funny review as actual review in the seeding script?
Ok i get the feedback, and since we haven't talked about what to prioritize implementing before the next and final interim delivery i get why you want to remove the ratings. Several people gave feedback expressing a wish to include ratings in comments, so i thought this would be a pretty simple and fair feature to implement. I can remove it until we decide, but curious to hear what you think about implementing it. When it comes to linking to the game details page i still use mock data, and thus there is no details to link to. I didn't make it clear enough in the description, but this was to limit the scope of this issue. I kind of got a bit carried away, since i initially planed to just touch up the featured carousel. Therefore i planed to implement actual fetching of games and reviews in a separate issue. I think this anwers the part about not having the top rated games currently, as this is simply placeholder data to implement the ui, however i have designed the code to make it easy to use actual data. I was planning to actually fetch the top 5 rated games with reviewcount as tie-breaker, but we can discuss the best approach. |
Summary
Improves the featured games carousel with platform icons and ratings, and adds a new "Top rated games" section with auto-scrolling community reviews to break up the game carousels on the home page.
Closes #77
Changes
PlatformDisplaycomponent that shows platform icons (usingreact-icons), which can also be reused on the game details pageplatformsandratingtoGameSummaryin the GraphQL schema and resolvers, and fetched them in the featured carouselTop5Gamessection with a ranked list and a community reviews panel, placed between the game carousels (uses mock data for now)StarDisplay,ReviewCardandReviewPanelcomponents for showing reviews. StarDisplay can easily be placed on the game details page @kfmelen 😉useAutoScrollhook that slowly scrolls the reviews in a seamless infinite loop, pauses on hover/focus, wraps manual scrolling and respects reduced motionuseMediaQueryhook, used to skip rendering the reviews panel on narrow screens, where the list takes the full width insteadSectionHeadingnow supports an optional subtext--content-max-widthso content stops growing earlier when zooming out, and added sharedh3/h4sizes and new color variablesNotes
gameIdsparameter inTop5Games. This is intentional: the prop is there to prepare for the real implementation, which will fetch the top 5 games and their reviews instead of using mock data.Follow-ups
Top5Gamessection